<template>
	<view class="msg_item" @click="gotochatroom">
		<view class="msg_l">
			<image v-if="msgitem.image_1920" :src="msgitem.image_1920"></image>
			<image v-else-if="msgitem.content" src="../../static/image/message/notice.png"></image>
			<image v-else src="../../static/image/message/remind.png"></image>
		</view>
		<view class="msg_r">
			<view class="msg_text">
				<view>
					<text>{{msgitem.name}}</text>
					<text class="work_type_name" v-if="msgitem.work_type_name">({{msgitem.work_type_name}})</text>
				</view>
				<text class="dates" v-if="msgitem.msg_create_date">{{msgitem.msg_create_date}}</text>
				<text class="dates" v-if="msgitem.date">{{msgitem.date}}</text>
			</view>
			<view class="msg_detail unread_message" v-if="msgitem.msg">
				<text class="msgs">{{msgitem.msg}}</text>
				<view class="num" v-if="msgitem.unread_count&&msgitem.unread_count>0">
					<text>{{msgitem.unread_count}}</text>
				</view>
			</view>
			<view class="msg_detail unread" v-if="msgitem.content">
				<text class="msgs">{{msgitem.content}}</text>
				<text class="spot" v-if="msgitem.state&&msgitem.state=='未读'"></text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			msgitem: {
				type: Object,
				default: () => {}
			},
		},
		data() {
			return {
				msg: {},
				accept_id:'',
				title:''
			}
		},
		methods: {
			gotochatroom(){
				if(this.msgitem.state){
					uni.setStorageSync('messageDetail', JSON.stringify(this.msgitem))
					uni.navigateTo({
						url: '../../pagesB/message/messageDetail'
					})
				}else{
					if(JSON.parse(uni.getStorageSync('userInfo')).uid==this.msgitem.user_id){
						this.accept_id = this.msgitem.reciver_id
					}else{
						this.accept_id = this.msgitem.user_id
					}
					uni.setStorageSync('image_1920', JSON.stringify(this.msgitem.image_1920))
					this.title = this.msgitem.name
					if(this.msgitem.recruit_id!=-1){
						var type = '招工订单'
						uni.navigateTo({
							url:`/pages/main/chat/chatroom?type=${type}&&id=${this.msgitem.recruit_id}&&accept_id=${this.accept_id}&&title=${this.title}`
						})
					}else{
						var type = '找活订单'
						uni.navigateTo({
							url:`/pages/main/chat/chatroom?type=${type}&&id=${this.msgitem.work_id}&&accept_id=${this.accept_id}&&title=${this.title}`
						})
					}
					this.$emit('updatenum',this.msgitem)
				}
			}
		}
	}
</script>

<style lang="less" scoped>
	.msg_item {
		height: 166rpx;
		display: flex;
		align-items: center;

		.msg_l {
			image {
				width: 94rpx;
				height: 94rpx;
				border-radius: 50%;
			}
		}

		.msg_r {
			width: 100%;
			height: 100%;
			display: flex;
			flex-direction: column;
			justify-content: center;
			border-bottom: 2rpx solid #D8D8D8;
			margin-left: 26rpx;

			.msg_text {
				font-size: 32rpx;
				color: #181818;
				display: flex;
				align-items: center;
				justify-content: space-between;
				>view{
					display: flex;
				}
				.work_type_name{
					word-break: break-all;
					max-width: 170rpx;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}

				.dates {
					font-size: 26rpx;
					color: #999999;
				}
			}

			.msg_detail {
				font-size: 28rpx;
				color: #666666;
				max-width: 545rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				margin-top: 15rpx;
				.msgs{
					max-width: 500rpx;
					text-overflow: ellipsis;
					white-space: nowrap;
					overflow: hidden;
				}
			}
			.unread_message{
				display: flex;
				align-items: center;
				justify-content: space-between;
				max-width: 100%;
				.num{
					display: flex;
					align-items: center;
					justify-content: center;
					padding: 2rpx 10rpx;
					border-radius: 50%;
					font-size: 26rpx;
					background: #FF3B30;
					color: #fff;
				}
			}
			.unread{
				display: flex;
				align-items: center;
				justify-content: space-between;
				.spot{
					width: 16rpx;
					height: 16rpx;
					border-radius: 50%;
					background: #FF3B30;
				}
			}
		}
	}
</style>
